<script setup lang="ts">
import { ref } from 'vue'
import { get } from '@/utils/service'
import { showNotify } from 'vant'
import { VUE_APP_BASE_API } from '@/utils/baseConfig'
const recommendCustomerView = ref({})
const mySelf = ref({})
const memberChildrenStatic = ref({})
const spreadDetail = ref({})
const noEmpty = ref(false)
const showSignDialog = ref(false)

queryMyChildrenStatic()
queryWechatMyQrcode()
function onClickLeft() {
  window.history.back()
}
function queryMyChildrenStatic() {
  get('/memberWechatNew/queryMyChildrenStatic', {}).then((res) => {
    if (res.code == 0) {
      recommendCustomerView.value = res.data
      memberChildrenStatic.value = res.data
      mySelf.value = res.data.member
    }
  })
}

function queryWechatMyQrcode() {
  // 异步更新数据
  // setTimeout 仅做示例，真实场景中一般为 ajax 请求
  get('/memberWechatNew/queryWechatMyQrcode', {})
    .then((res) => {
      if (res.code === 0) {
        res.data.qrcode=VUE_APP_BASE_API+res.data.qrcode;
        spreadDetail.value = res.data
        noEmpty.value = false
      } else {
        noEmpty.value = true
      }
    })
    .catch((err) => {
      console.log(err)
    })
}
function updateWechatMemberSpreadDetailQrcode() {
  get('/memberWechatNew/updateWechatMemberSpreadDetailQrcode', {})
    .then((res) => {
      if (res.code === 0) {
        spreadDetail.value = res.data
        noEmpty.value = false
      } else {
        noEmpty.value = true
        showNotify({ type: 'danger', message: res.msg })
      }
    })
    .catch((err) => {
      console.log(err)
    })
}
function createPoster(){
  const sceneStr=spreadDetail.value.sceneStr;
  get("/memberWechatNew/createPoster",{sceneStr:sceneStr}).then((res)=>{
     if (res.code === 0) {
        spreadDetail.value.posterImageUrl = VUE_APP_BASE_API +res.data
        showSignDialog.value=true;
      } else {
        showNotify({ type: 'danger', message: res.msg })
      }
  }).catch((err) => {
      console.log(err)
  })
}

</script>
<template>
  <van-nav-bar title="我的推广码" left-text="返回" left-arrow @click-left="onClickLeft" />
  <van-empty
    v-if="noEmpty == true"
    :image="VUE_APP_BASE_API+'/images/vue/noData.png'"
    image-size="100"
    description="无推广码"
  />
  <div class="mainContent" v-if="noEmpty == true">
    <div style="width: 100%; padding: 12px">
      <van-button type="primary" style="width: 100%" @click="updateWechatMemberSpreadDetailQrcode"
        >获取推广码</van-button
      >
    </div>
  </div>
    <div class="memberCarEmptyContent" v-if="noEmpty == false"><!--无套餐 -->

    <div class="minaImageContent">
        <div style="text-align: center">
          <img style="width: 320px;" :src="spreadDetail.qrcode"></img>
        </div>
        <p class="friendTip">邀请朋友扫描我的二维码</p>
        <p class="friendTip">或长按二维码保存图片-分享给朋友</p>
        <!-- <div style="margin-top: 12px;">
          <p style="color: var(--sub-two-color);">长按识别瑞一荟积分商城</p>
        </div> -->
      </div>
  </div><!--无套餐-->
  <div class="myPointDes" v-if="noEmpty == false">
    <div class="myRewardHeader">
      <div style="padding: 12px">
        <h2 style="text-align: left">
          扫码次数:<span>{{ memberChildrenStatic.scanNum || 0 }}</span>
        </h2>
      </div>
      <div style="padding: 12px">
        <h2 style="text-align: left">
          我的下级:<span>{{ memberChildrenStatic.myChildrenNum || 0 }}</span>
        </h2>
      </div>
    </div>
  </div>
  <div class="mainContent" v-if="noEmpty == false">
    <div style="width: 100%; padding: 12px">
      <van-button type="primary" style="width: 100%" @click="createPoster"
        >生成我的推广海报</van-button
      >
    </div>
  </div>

    <van-popup closeable v-model:show="showSignDialog" position="bottom" round :style="{height: '96%'}">
    <div class="mainContent" style="text-align: center;">
      <img :src="spreadDetail.posterImageUrl" style="padding: 40px 12px;width: 90%;border-radius: 12px;"></img>
      <p class="friendTip" style="color:var(--main-color);font-size:16px;">长按图片保存发送给朋友</p>
    </div>
  </van-popup>
  <br />
</template>
